<div class="row-fluid">
    <div class="span7">
        <div class="widget">
            <div class="wTitle">
                <h5>Add New Manga</h5>
            </div>
            <div class="wContent">
                <div class="formField" id="manga_edit">
                    <input type="hidden" id="manga_id" value="<?= $manga->id ?>" />
                    <input type="hidden" id="manga_slug" value="<?= $manga->slug ?>" />
                    <input type="hidden" id="cover_hidden" value="<?= $manga->cover ?>" />
                    <div class="row-fluid">
                        <!-- Manga name  -->
                        <div class="span3">
                            <span class="fLabel" for="name">Name:</span>
                        </div>
                        <div class="span8">
                            <div class="iconField">
                                <input value="<?= $manga->name ?>" id="name" class="ui-wizard-content" type="text" name="name" placeholder="name">
                                <img alt="" src="<?php echo base_url(); ?>assets/img/icons/14x14/book.png">
                            </div>
                        </div>
                        <div class="span1">
                            <label class="error" for="name" generated="true">(*)</label>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <!-- Other name  -->
                        <div class="span3">
                            <span class="fLabel" for="oname">Other Name:</span>
                        </div>
                        <div class="span8">
                            <div class="iconField">
                                <input value="<?= $manga->oname ?>" id="oname" class="ui-wizard-content" type="text" name="oname" placeholder="name">
                            </div>
                        </div>
                        <div class="span1">
                        </div>
                    </div>
                    <div class="row-fluid">
                        <!-- Author  -->
                        <div class="span3">
                            <span class="fLabel" for="author">Author:</span>
                        </div>
                        <div class="span8">
                            <div class="iconField">
                                <input value="<?= $manga->author ?>" id="author" class="ui-wizard-content" type="text" name="author" placeholder="author">
                                <img alt="" src="<?php echo base_url(); ?>assets/img/icons/14x14/member2.png">
                            </div>
                        </div>
                        <div class="span1">
                            <label class="error" for="author" generated="true">(*)</label>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <!-- Author  -->
                        <div class="span3">
                            <span class="fLabel" for="translator">Translator:</span>
                        </div>
                        <div class="span8">
                            <div class="iconField">
                                <input value="<?= $manga->translator ?>" id="translator" class="ui-wizard-content" type="text" name="translator" placeholder="Translator">
                                <img alt="" src="<?php echo base_url(); ?>assets/img/icons/14x14/member2.png">
                            </div>
                        </div>
                        <div class="span1">
                            <label class="error" for="translator" generated="true">(*)</label>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <!-- Description  -->
                        <div class="span3">
                            <span class="fLabel" for="desc">Description:</span>
                        </div>
                        <div class="span8">
                            <div class="iconField">
                                <textarea id="desc" rows="6" name="desc" placeholder="Manga description"><?= $manga->description ?></textarea>
                            </div>
                        </div>
                        <div class="span1">
                            <label class="error" for="desc" generated="true">(*)</label>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <div class="span3">
                            <span class="fLabel" for="status">Status:</span>
                        </div>
                        <div class="span8">
                            <label class="formButton">
                                <input type="radio" value="1" name="status" <?php echo $manga->status == 1 ? 'checked="checked"' : ''; ?>>
                                <span class="text-success">Processing</span>
                            </label>
                            <label class="formButton">
                                <input type="radio" value="2" name="status" <?php echo $manga->status == 2 ? 'checked="checked"' : ''; ?>>
                                <span class="text-error">Stoped</span>
                            </label>
                            <label class="formButton">
                                <input type="radio" value="3" name="status" <?php echo $manga->status == 3 ? 'checked="checked"' : ''; ?>>
                                <span class="text-info">Finish</span>
                            </label>
                        </div>
                    </div>	
                    <div class="row-fluid">
                        <div class="span12" align="center">
                            <input id="edit_manga_submit" class="button sButton bOlive ui-wizard-content ui-formwizard-button" type="button" value="submit">
                        </div>
                    </div>
                    <div class="row-fluid hide" id="err_msg">
                        <div class="span12" align="center">
                            <div class="alert alert-error noMargin">
                            </div>
                        </div>
                    </div>	
                </div>
            </div>
        </div>
    </div>
    <div class="span5">
        <div class="widget">
            <div class="wTitle">
                <h5>Cover</h5>
            </div>
            <div class="wContent">
                <div class="row-fluid">
                    <div class="span5">
                        <ul class="thumbs span11" align="center">
                            <li class="cover_wpr">
                                <a href="#" class="<?php echo $manga->cover == '' ? 'uploadCover' : '' ?>" id="uploadCover">
                                    <img src="<?php echo base_url() . $manga->cover; ?>" />
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="span7">
                        <div class="formField">
                            <ul>
                                <li>Click on image beside to upload new cover.</li>
                                <li>The cover will be resize to 200x300 dimension.</li>
                                <li>Only PNG, JPG, JPEG are allowed.</li>
                            </ul>
                        </div>
                        <div class="coverErr">
                            <ul class="text-error"></ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="divider"><div><span></span></div></div>
        <div class="row-fluid">
            <div class="span12">
                <div class="widget">
                    <div class="wTitle">
                        <h5>Manage Tools</h5>
                    </div>
                    <div class="wContent">
                        <div class="formField">
                            <div class="row-fluid" align="center">
                                <a class="button sButton bMuddy editRemoveManga" href="#" id="removeManga_<?= $manga->id ?>" rel="<?= $manga->name ?>">Remove forever</a>
                            </div>
                            <div class="row-fluid" align="center">
                            </div>

                        </div>
                    </div>
                </div>
            </div>	
        </div>
    </div>
</div>
<div class="divider"><div><span></span></div></div>
<div class="row-fluid">
    <div class="span2">
        <div class="widget">
            <div class="wTitle">
                <h5>Chapter List</h5>
                <h5 class="pull-right showParseManga" id="showParseManga" >
                    <a href="#"><i class="icon-arrow-right"></i></a>
                </h5>
            </div>
            <div class="wContent">
                <div class="formField">
                    <div class="row-fluid">
                        <div class="span7 form-inline ">
                            <input id="inpAddChapter" pattern="\d*" type="text" class="input-small" placeholder="Chapter">
                        </div>
                        <div class="span5">
                            <a id="btnAddChapter" class="label noShadow bSky submitBtn" href="#">Add</a>
                        </div>
                    </div>
                </div>	
                <div class="box-wrap antiscroll-wrap wContentInner">
                    <div class="box">
                        <div class="antiscroll-inner">
                            <div class="box-inner">
                                <input type="hidden" id="chapter_id" value="" />
                                <ul id="chapterList" class="unstyled chapterList">
                                    <?php foreach ($manga->chapter as $chapter) { ?>
                                        <li>
                                            <a href="#" rel="<?= $chapter['chapter'] ?>">
                                                <span class="badge noShadow bSky"><?= $chapter['chapter'] ?></span> <i class="pull-right muted"><?= date('d-M-Y', $chapter['chapter']) ?></i>
                                            </a>	
                                        </li>
                                    <?php } ?>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="span10" id="chapterBlock">
        <div class="widget parseManga hide" id="parseManga">
            <div class="wTitle">
                <h5>Parse Manga Tools</h5>
            </div>
            <div class="wContent">
                <div class="formField">
                    <div class="row-fluid">
                        <div class="span3 noSearch mangaLinkOpt">
                            <select class="chosen" id="mangaLinkFrom">
                                <option value="0">Truyen Tranh Tuần</option>
                            </select>
                        </div>
                        <div class="span6 noSearch">
                            <label class="formButton"><input type="radio" value="0" name="parseMangaType" checked="checked"> <span>List only</span></label>
                            <label class="formButton"><input type="radio" value="1" name="parseMangaType"> <span>Both List And Image</span></label>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <div class="span6">
                            <input type="text" id="parseMangaLink" placeholder="Parse manga link" />
                        </div>
                        <div class="span1">
                            <a href="#" class="label noShadow bSky submitBtn" id="parseMangaBtn">Parse</a>
                        </div>
                    </div>
                    <div class="" id="parseMangaIframe"></div>
                    <div class="row-fluid">
                        <div id="parseManga_errMsg" class="span8 hide" align="left" >
                            <div class="alert alert-error noMargin"></div>
                        </div>
                    </div>
                    <div class="row-fluid hide parseMangaAction hide" id="parseMangaAction">
                        <a class="button bSky pull-left" id="updateAllChapterCtn" rel="" href="#">Save All</a>
                        <a class="button bMuddy pull-right" id="emptyAllChapterCtn" rel="" href="#">Empty All</a>
                    </div>
                    <div class="row-fluid hide parseMangaResult" id="parseMangaResult">
                        <div class="mangaResultList" id="mangaResultList"></div>
                    </div>
                </div>
            </div>	
        </div>	
        <div class="widget hide chapterDetail" id="chapterDetail">
            <div class="wTitle">
                <h5>Chapter Detail</h5>
                <h5 class="text-error hide pull-right" id="chapterErr" style="font-weight: normal;"></h5>
            </div>
            <div class="wContent">
                <div class="tabbable">
                    <div class="navbar-inner">
                        <ul class="nav nav-tabs">
                            <li class="active"><a href="#chapterInfo" data-toggle="tab">List Images</a></li>
                            <li class=""><a href="#uploadNew" data-toggle="tab">Upload New</a></li>
                            <li class=""><a href="#singleLink" data-toggle="tab">Single Link</a></li>
                            <li class=""><a href="#parseLink" data-toggle="tab">Parser Link</a></li>
                        </ul>
                    </div>
                    <div class="wContentInner">
                        <div class="tab-content">
                            <div id="chapterInfo" class="tab-pane"></div>
                            <div id="uploadNew" class="tab-pane">
                                <div id="chapter_uploader"></div>
                            </div>
                            <div id="singleLink" class="tab-pane">
                                <div id="chapter_sigleLink">
                                    <div class="row-fluid">
                                        <div class="span8">
                                            <input type="text" id="singleLinkInpt" placeholder="Image Link">
                                        </div>
                                        <div class="span1">
                                            <a href="#" class="label noShadow bSky submitBtn" id="singleLinkBtn">Get</a>
                                        </div>
                                    </div>
                                    <div class="row-fluid">
                                        <div id="singleLink_errMsg" class="span8 hide" align="left" >
                                            <div class="alert alert-error noMargin"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="parseLink" class="tab-pane parseLink">
                                <div id="chapter_pasrseLink">
                                    <div class="row-fluid">
                                        <div class="span3 noSearch parseLinkOpt">
                                            <select class="chosen" id="parseLinkOpt">
                                                <option value="0">Truyen Tranh Tuần</option>
                                            </select>
                                        </div>
                                        <div class="span7">
                                            <input type="text" id="parseLinkInpt" placeholder="Parse Link">
                                        </div>
                                        <div class="span1">
                                            <a href="#" class="label noShadow bSky submitBtn" id="parseLinkBtn">Parse</a>
                                        </div>
                                    </div>
                                    <div class="row-fluid">
                                        <div id="parseLink_errMsg" class="span8 hide" align="left" >
                                            <div class="alert alert-error noMargin"></div>
                                        </div>
                                    </div>
                                    <div class="row-fluid" id="parseIframe"></div>
                                </div>
                            </div>
                        </div>
                        <div id="listImg">
                            <div class="header-content clearfix">
                                <a class="button bSky pull-left" id="updateChapterCtn" rel="" href="#">Save</a>
                                <a class="button bMuddy pull-right" id="deleteChapterCtn" rel="" href="#">Delete</a>
                                <a class="button bAutumn pull-right" id="emptyChapterCtn" rel="" href="#">Empty</a>
                            </div>
                            <ul id="sortable" class="thumbs chapterPic clearfix" align="center"></ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>